import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getwidget/getwidget.dart';
import 'package:meal/constant/fonts.dart';
import 'package:meal/constant/sizes.dart';
import 'package:meal/ui/pay_pwd.dart';
import 'package:meal/utils/colors.dart';
import 'package:meal/utils/styles.dart';
import 'package:meal/utils/tools.dart';

///
/// 活动报名费用
///
class MarketActivityPay extends StatefulWidget {
  const MarketActivityPay({Key? key}) : super(key: key);

  @override
  State<MarketActivityPay> createState() => _MarketActivityPayState();
}

class _MarketActivityPayState extends State<MarketActivityPay> {

  String pwd = '';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ToolsUtils.getDefaultBackgroundColor(),
      appBar: ToolsUtils.getDefaultBrnAppBar('报名活动'),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Container(
              margin: const EdgeInsets.all(Sizes.default20),
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
              padding: const EdgeInsets.all(Sizes.default15),
              child: ListBody(
                children: [
                  Container(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '支付项目',
                      style: StylesUtils.customTextStyle(
                          fontSize: Sizes.default15,
                          fontWeight: Fonts.w7,
                          color: ColorsUtils.color333),
                    ),
                  ),
                  Container(
                    margin: const EdgeInsets.symmetric(vertical: Sizes.default15),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          '营销活动',
                          style: StylesUtils.customTextStyle(
                              color: ColorsUtils.color333, fontSize: Sizes.default15),
                        ),
                        Text(
                          '新店八折特惠',
                          style: StylesUtils.customTextStyle(
                              color: ColorsUtils.color797,
                              fontSize: Sizes.default15,
                              fontWeight: Fonts.w7),
                        )
                      ],
                    ),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        '报名费用',
                        style: StylesUtils.customTextStyle(
                            fontSize: Sizes.default15, color: ColorsUtils.color333),
                      ),
                      Text(
                        '￥20.00',
                        style: StylesUtils.customTextStyle(
                            color: ColorsUtils.colorFf0,
                            fontSize: Sizes.default15,
                            fontWeight: Fonts.w7),
                      )
                    ],
                  )
                ],
              ),
            ),
            Container(
              margin: const EdgeInsets.only(
                  left: Sizes.default20, right: Sizes.default20, bottom: Sizes.default20),
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
              padding: const EdgeInsets.all(Sizes.default15),
              child: ListBody(
                children: [
                  Container(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '支付方式',
                      style: StylesUtils.customTextStyle(
                          fontSize: Sizes.default15,
                          fontWeight: Fonts.w7,
                          color: ColorsUtils.color333),
                    ),
                  ),
                  Container(
                    margin: const EdgeInsets.only(top: Sizes.default15),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          '账户余额',
                          style: StylesUtils.customTextStyle(
                              color: ColorsUtils.color333, fontSize: Sizes.default15),
                        ),
                        Text(
                          '￥200.04',
                          style: StylesUtils.customTextStyle(
                              color: ColorsUtils.color797,
                              fontSize: Sizes.default15,
                              fontWeight: Fonts.w7),
                        )
                      ],
                    ),
                  ),
                ],
              ),
            ),
            Container(
              margin: const EdgeInsets.symmetric(horizontal: Sizes.default20),
              alignment: Alignment.centerLeft,
              child: TextButton(
                  onPressed: () {},
                  child: Text.rich(TextSpan(
                      text: '余额不足了？',
                      style: StylesUtils.customTextStyle(
                          color: ColorsUtils.color333, fontSize: Sizes.default12),
                      children: [
                        TextSpan(
                            text: '我要充值 >',
                            style: StylesUtils.customTextStyle(
                                color: ColorsUtils.colorFf6, fontSize: Sizes.default12))
                      ]))),
            ),
            Container(
              margin: const EdgeInsets.only(
                  left: Sizes.default20, right: Sizes.default20, top: Sizes.default20),
              height: Sizes.default50,
              child: FractionallySizedBox(
                heightFactor: 0.9,
                widthFactor: 1.0,
                child: GFButton(
                    onPressed: onSubmit,
                    text: '去支付',
                    textStyle: StylesUtils.customTextStyle(fontSize: Sizes.default16),
                    shape: GFButtonShape.pills,
                    type: GFButtonType.solid,
                    size: GFSize.LARGE,
                    color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorFf6)),
              ),
            )
          ],
        ),
      ),
    );
  }

  void onSubmit() {
    showDialog(
        context: context,
        barrierDismissible: true,
        builder: (_) {
          return StatefulBuilder(builder: (BuildContext context, setState) {
            return PayPwd(
                pwd: pwd,
                callback: (String value) {
                  setState(() {
                    if (value.length == 6) {
                      /// 跳转
                      Future.delayed(const Duration(milliseconds: 50), () {
                        Navigator.of(context).pop();
                        pwd = '';
                        Get.back();
                      });
                    } else {
                      pwd = value;
                    }
                  });
                });
          });
        });
  }
}
